<script setup lang="ts">
import { ref } from 'vue';
import { addUserFn } from '@/api/addUser';
import { useRouter } from 'vue-router';
import { showToast } from 'vant';
import { useUserStore } from '@/stores/user';

const userStore = useUserStore();//返回值

const value = ref('');
const errorInfo = ref('');
const showKeyboard = ref(true);
const router = useRouter();

function loginClick(){
 // 调用登录接口 验证密码    密码输入错误时这个接口有问题
 console.log(value.value);
 addUserFn({username:localStorage.getItem('username'),
 password:value.value}).then(res => {
    console.log(res.token);   //token值
    if(res.token){
      userStore.userInfoFn({   
            token:res.token
          })
          //  if(route.query.type == 'detail'){
          //     router.back()
          //  }
          //  else{
          //   router.push('/')   //首页 会重定向到/home
          //  }
         
      //跳转页面
      // showDialog({ message: '登陆成功' })
      showToast('登陆成功');
      router.push('/home');
     

      // 数据存到全局 pinia 并存到本地
    }
  }
 )
 
}
</script>
<template>
    <main>
        <h1 @click="router.back()"><</h1>
      <span>
        我们将以短信或电话的形式，把验证码发送至 136****5678，请留意手机短信，或接听0755/0766/025/010等开头的电话。  
      </span>

      <section>

<!-- 密码输入框   v-model="value"-->
<van-password-input
  :value="value"
    :mask="false"
  :focused="showKeyboard"
  @focus="showKeyboard = true"
/>

<!-- 数字键盘   必须要搭配键盘使用 密码输入-->
<van-number-keyboard
  v-model="value"
  :show="showKeyboard"
  @blur="showKeyboard = false"
/>
      </section>

      <van-button :disabled="!value" class="getcode" block round @click="loginClick">登陆</van-button>
    </main>
  
  
  </template>

<style lang="scss" scoped>
.getcode{
    background: linear-gradient(to right, #f09736, #eb642b);
    color: white;
    margin-top: 20px;
}

</style>